import React from 'react';
/* Loading组件：主要用来优化用户体验 */
// 引入加载样式
import { Spin } from 'antd'
// 引入css-in-js
import styled from 'styled-components'
// 引入校验数据类型
import Pts from 'prop-types'
const Loading = (props) => {
    return (
        <Tt>
            <Spin size='large' spinning={props.spinning} tip={props.tip}></Spin>
        </Tt>
    );
}

// 根据实际情况需对组件库的组件进行二次封装
// 1.设置默认属性、并设置默认值；根据实际情况接收父组件的值来修改默认值
Loading.defaultProps = {
    spinning: true,
    tip: '加载中...'
}
// 2.对参数类型进行校验
Loading.propTypes = {
    spinning: Pts.bool,
    tip: Pts.string
}

// 使用css-in-js
let Tt = styled.div`
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
`
export default Loading;
